<!DOCTYPE html>
<html lang="en">

<head>
    <link rel="icon" href="logo.jpg" type="image/x-icon" />

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="styled.css">
    <meta name="author" content="李宗洋" />
    <title>爱好</title>
</head>

<body>






    <div class="wrapper init">
        <ul class="content">
            <li class="item">
                <div class="inner">
                    <div class="bjPic"></div>
                    <div class="dir">
                        <h2>动漫</h2>
                    </div>
                    <div class="showBox">
                        <div class="showBox-dir">
                            <h2>2011年，我的第一次接触了，便
                                <p class="yangshi">深陷于此</p>
                                。</h2><br>
                            <p class="yangshia">《東京喰種トーキョーグール》
                            </p>
                            <p class="yangshia">《ソードアート・オンラインjxc》
                            </p>
                            <p class="yangshia">《東京レイヴンズ》
                            </p>
                            <p class="yangshia">《未来日記》

                            </p>
                            <p class="yangshia">《さくら荘のペットな彼女》

                            </p>
                            <br>

                            <p style="font-size:150%; color:rgb(255, 255, 255)"> 是我最喜欢的动漫</p>


                        </div>
                        <div class="close">

                        </div>
                    </div>
                </div>

            </li>
            <li class="item">
                <div class="inner">
                    <div class="bjPic"></div>
                    <div class="dir">
                        <h2>摄影</h2>

                    </div>
                    <div class="showBox">
                        <div class="showBox-dir">
                            <p style="font-size:150%; color:rgb(255, 255, 255)">业余时间我喜欢拍一些风景优美的地方</p>
                        </div>
                        <div class="close">

                        </div>
                    </div>
                </div>

            </li>
            <li class="item">
                <div class="inner">
                    <div class="bjPic"></div>
                    <div class="dir">
                        <h2>游戏</h2>
                    </div>
                    <div class="showBox">
                        <div class="showBox-dir">
                            <p style="font-size:150%; color:rgb(255, 255, 255)">我会用游戏来放松自己</p><br>
                            <p>《League of Legends》<br> 《MONSTER HUNTER WORLD》<br> 《Dark Souls III》
                            </p><br>
                            <p style="font-size:100%; color:rgb(255, 255, 255)">是我经常玩的游戏</p>
                        </div>
                        <div class="close">

                        </div>
                    </div>
                </div>

            </li>
            <li class="item">
                <div class="inner">
                    <div class="bjPic"></div>
                    <div class="dir">
                        <h2>科学</h2>
                    </div>
                    <div class="showBox">
                        <div class="showBox-dir">
                            <p style="font-size:150%; color:rgb(255, 255, 255)">从小我就对自然科学报有极大的兴趣</p>
                        </div>
                        <div class="close">

                        </div>
                    </div>
                </div>

            </li>
            <li class="item">
                <div class="inner">
                    <div class="bjPic"></div>
                    <div class="dir">
                        <h2>电影</h2>
                    </div>
                    <div class="showBox">
                        <div class="showBox-dir">
                            <p style="font-size:150%; color:rgb(255, 255, 255)">一部优秀的电影能让我兴奋不已</p>
                        </div>
                        <div class="close">

                        </div>
                    </div>
                </div>

            </li>
            <li class="item">
                <div class="inner">
                    <div class="bjPic"></div>
                    <div class="dir">
                        <h2>旅游</h2>
                    </div>
                    <div class="showBox">
                        <div class="showBox-dir">
                            <p style="font-size:150%; color:rgb(255, 255, 255)">我的梦想之一就是能够去到世界各地</p>
                        </div>
                        <div class="close">

                        </div>
                    </div>
                </div>

            </li>
            <li class="item">
                <div class="inner">
                    <div class="bjPic"></div>
                    <div class="dir">
                        <h2>星空</h2>
                    </div>
                    <div class="showBox">
                        <div class="showBox-dir">
                            <p style="font-size:150%; color:rgb(255, 255, 255)">对未知的探索让我无数次仰望星空</p>
                        </div>
                        <div class="close">

                        </div>
                    </div>
                </div>

            </li>

        </ul>
    </div>
    <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
    <script src="./index.js"></script>

</body>

</html>